import { ShapeFlages } from "../shared/ShapeFlags";

/**
 * 初始化组件实例对象上的 slot
 * @param instance 组件实例
 * @param children 未处理的 slots
 */
export function initSlots(instance, children) {
    const { vnode } = instance;

    // 判断组件是否有插槽
    if (!(vnode.shapeFlag & ShapeFlages.SLOT_CHILDREN)) {
        console.log('组件实例不包含插槽内容，不需要初始化插槽数据!', instance, children);
        return;
    }

    console.log('初始化处理插槽数据，组件实例：', instance, children);
    // 处理插槽相关数据
    normalizeObjectValue(instance, children);
    // 处理 attrs 
}


/**
 * 标准化处理一个插槽，把插槽对象中的每一个 key 值对应的value 用数组包裹
 * @param instance instance  的引用
 * @param slots 未处理的插槽列表
 */
function normalizeObjectValue(instance, slots: any) {
    // children 给一个默认值，防止 proxy 组件代理对象因为 children 为 非对象报错
    if (!slots)
        slots = {};

    for (const key in slots) {
        const value = slots[key];
        // 转换为数组类型,并给 slot 对象对应的key 赋值
        // props 为 renderSlots 时候传入的作用域插槽参数,通过 调用 slot 传入，
        // 最终转执行 value（） 把 value（） 也就是新的 createVNode 虚拟节点转为数组类型数据并返回
        slots[key] = (props) => {
            return normalizeSlotValue(value(props))
        };
    }
    instance.slots = slots;

}

/**
 * 标准化处理一个插槽，把插槽对象中的每一个 key 值对应的value 用数组包裹
 * @param value 未处理的插槽列表
 * @return 数组包裹的 value 
 */
function normalizeSlotValue(value) {
    return Array.isArray(value) ? value : [value];
}